<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>当当图书榜</title>
		<style>
			*{
				margin: 0px;
				padding: 0px;
			}
			img{
				vertical-align: middle;
			}
			body{
				font-family: Verdana,"宋体";
				font-size:12px;
			}
			.box{
				width:960px;
				margin: 0 auto;
			}
			.clearfix:after{
				display: table;
				content: "";
				clear:both;
			}
			.fl{
				float: left;
			}
			.fr{
				float:right;
			}
			.top{
				width: 960px;
				height: 48px;
			}
			.top a{
				text-decoration: none;
				color:#818382;
			}
			.txt{
				margin-top: 20px;
				width: 200px;
				text-align: center;
				height: 27px;
				line-height: 27px;
				background-color: #eafffa;
				border-top:1px solid #dcf3ed;
				border-left:1px solid #dcf3ed;
				border-top:1px solid #dcf3ed;
				position: relative;
			}
			.icon{
				position: absolute;
				left:12px;
				top: -18px;
			}
			.nav{
				margin-top: 10px;
				margin-bottom: 10px;
				height: 30px;
				background: url(image/menuBg.jpg) repeat;
				text-align: center;
			}
			.nav a{
				line-height: 30px;
				text-decoration: none;
				color:white;
				margin-left: 28px;
			}
			.nav a:first-child{
				margin-left: -2px;
			}
			.cnt{
				margin-top: 20px;
				border: 1px solid #cce9ac;
				padding-top: 80px;
				padding-bottom: 20px;
				position: relative;
			}
			.bg{
				position: absolute;
				left: -13px;
				top:16px;
			}
			.cntr{
				margin-left: 18px;
			}
			.txtb{
				line-height: 24px;
			}
			.book{
				position: relative;
			}
			.bookno1{
				position: absolute;
				left: 18px;
				top:-4px
			}
			.bookno2,.bookno3{
				position: absolute;
				left: 0px;
				top:-10px
			}
			.book1{
				width:300px;
				margin-top: 18px;
			}
			.book2{
				width:250px;
			}
			.book3{
				width:250px;
			}
			.cnt a{
				text-decoration: none;
				font-size: 14px;
				color: #4f89c4;
			}
			span{
				color: #941d33;
			}
			.bottom{
				color: #8b8b8b;
				text-align: center;
			}
		</style>
	</head>

	<body>
		<div class="box">
			<div class="top clearfix">
				<div class="img fl"><img src="image/logo.jpg" /></div>
				<div class="txt fr">
						<a href="#">尾品汇</a>
						<a href="#">当当优品</a>
						<a href="#">数字馆</a>
						<a href="#">都看阅器</a>
						<div class="icon"><img src="image/icon_count.png" /></div>
				</div>
			</div>
			<div class="nav">
				<a href="#">首页</a>
				<a href="#">图书</a>
				<a href="#">音像</a>
				<a href="#">童装</a>
				<a href="#">服装</a>
				<a href="#">鞋靴</a>
				<a href="#">运动</a>
				<a href="#">箱包</a>
				<a href="#">美妆</a>
				<a href="#">珠宝</a>
				<a href="#">家居</a>
				<a href="#">食品</a>
				<a href="#">酒</a>
				<a href="#">手机</a>
				<a href="#">数码</a>
				<a href="#">电脑</a>
				<a href="#">家电</a>
			</div>
			<div><img src="image/banner.png" /></div>
			<div class="cnt clearfix">
				<div class="bg"><img src="image/bg_bang.gif" /></div>
				<div class="cntl fl">
					<div class="book fl">
						<img src="image/book-01.jpg">
						<div class="bookno1"><img src="image/bookNo1.gif" /></div>
					</div>
					<div class="txtb  book1 fl">
						<p><a href="#">偷影子的人</a></p>
						<p>作 者：[法] 马克·李维（Marc Levy）著,段韵灵 译</p>
						<p>出版社：湖南文艺出版社</p>
						<p>当当价：<span>￥ 17.90</span></p>
						<p>不知道姓氏的克蕾儿。这就是你在我生命里的角色，我童年时的小女孩，今日蜕变成了女人，一段青梅竹马的回忆，一个时间之神没有应允的愿望。 一个老是受班上同学欺负的瘦弱小男孩，因为拥有一种特殊能力而强大：他能“偷别人的影子”，因而能看见他</p>
					</div>
				</div>
				<div class="cntr fl">
					<div class="clearfix">
						<div class="book fl">
							<img src="image/book-02.jpg">
							<div class="bookno2"><img src="image/bookNo2.gif" /></div>
						</div>
						<div class="txtb  book2 fr">
							<p><a href="#">看见(央视知名记者、主持人柴静：十年个人成长的告白，中国社会变迁的备忘 </a></p>
							<p>作 者：柴静 著</p>
							<p>出版社：广西师范大学出版社</p>
							<p><span>￥ 29.40</span> 7.4折</p>
						</div>
					</div>
					<div class="clearfix">
						<div class="book fl">
							<img src="image/book-03.jpg">
							<div class="bookno3"><img src="image/bookNo3.gif" /></div>
						</div>
						<div class="txtb book3 fr">
							<p><a href="#">改变孩子先改变自己  </a></p>
							<p>作 者：贾容韬 贾毅 著</p>
							<p>出版社：作家出版社</p>
							<p><span>￥ 22.20</span> 7.4折</p>
						</div>
					</div>
				</div>
			</div>
			<div class="bottom">
				Copyright (C) 当当网 2004-2017, All Rights Reserved<img src="image/validate.gif" />京ICP证041189号出版物经营许可证 新出发京批字第直0673号
			</div>
		</div>
	</body>

</html>